﻿@{
    ViewBag.Title = "signup";
}



<div class="container">

    <div class="row">

        <div class="col-md-12">


            <h2>signup</h2>

            <form action="../Account/validateSignup" method="post" enctype="multipart/form-data">

                <table border="1">
                    <tr>
                        <td>

                            <table>

                                <tr>
                                    <td>
                                        Enter Username:
                                    </td>

                                    <td>
                                        <input type="text" name="username" id="username" placeholder="Enter UserName" size="34" required />
                                        <br />

                                    </td>

                                </tr>

                                <tr>
                                    <td></td>
                                    <td>
                                        <br />
                                        @*<input type="button" name="check" id="check" value="Check Availability" />*@
                                        <div id="result" style="color:red"></div>
                                        <br />
                                    </td>
                                </tr>

                                <tr>
                                    <td>
                                        Enter First Name:
                                    </td>

                                    <td>
                                        <p><input type="text" name="fname" id="fname" placeholder="Enter First Name" size="34" required /></p>
                                    </td>

                                </tr>


                                <tr>
                                    <td>
                                        Enter Last Name:
                                    </td>

                                    <td>
                                        <p><input type="text" name="lname" id="lname" placeholder="Enter Last Name" size="34" required /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        Gender
                                    </td>

                                    <td>
                                        <input type="radio" value="male" name="gender" checked /> Male  <br />
                                        <input type="radio" value="female" name="gender" /> Female <br /><br />
                                    </td>

                                </tr>


                                <tr>
                                    <td>
                                        <p>Date of Birth: </p>
                                    </td>

                                    <td>
                                        <p><input type="date" name="dob" id="dob" size="34" /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        <p>Address: </p>
                                    </td>

                                    <td>
                                        <p><input type="text" name="address" id="address" size="34" placeholder="Enter Address" /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        <p>Phone: </p>
                                    </td>

                                    <td>
                                        <p><input type="text" name="phone" id="phone" size="34" placeholder="Enter Phone Number" onkeypress="return isNumberKey(event)" /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        Enter E-mail Address: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    </td>

                                    <td>
                                        <p><input type="email" name="email" id="email" placeholder="Enter Email Address" size="34" required /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        Enter Password:
                                    </td>

                                    <td>
                                        <p><input type="password" name="pwd" id="pwd" placeholder="Enter Password" size="34" required /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        Confirm Password:
                                    </td>

                                    <td>
                                        <p><input type="password" name="cpwd" id="cpwd" placeholder="Re-Enter Password" size="34" required /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        Type
                                    </td>

                                    <td>
                                        <br />
                                        <input type="radio" value="student" name="type" id="type" checked /> Student  <br />
                                        <input type="radio" value="teacher" name="type" id="type1" /> Teacher <br />
                                    </td>

                                </tr>



                                <tr>
                                    <td>
                                        Secret Question:
                                    </td>

                                    <td>

                                        <p>
                                            <select name="question" id="question">
                                                <option value="select1">Select one&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
                                                <option value="What is the Name of your Favourite uncle?">What is the Name of your Favourite uncle?</option>
                                                <option value="What is the Name of Your Pet?">What is the Name of Your Pet?</option>
                                                <option value="What is Your Favourite Place?">What is Your Favourite Place?</option>
                                                <option value="What is Name of Your Favourite Book?">What is Name of Your Favourite Book?</option>
                                                <option value="What is Your Oldest Cousin Name?">What is Your Oldest Cousin Name?</option>
                                                <option value="What is Name of Your Favourite Teacher?">What is Name of Your Favourite Teacher?</option>
                                                <option value="What was Your Favourite Food as a Child?">What was Your Favourite Food as a Child?</option>
                                                <option value="Where You want to Spend Holidays?">Where You want to Spend Holidays?</option>
                                                <option value="Who is Your Favourite Author?">Who is Your Favourite Author?</option>
                                                <option value="Where did You Spend Your Honeymoon?">Where did You Spend Your Honeymoon?</option>
                                                <option value="What is the Last Name of your First Boss?">What is the Last Name of your First Boss?</option>
                                                <option value="What is Name of Your Favourite Musician?">What is Name of Your Favourite Musician?</option>
                                                <option value="What is the Name of your Favourite aunt?">What is the Name of your Favourite aunt? &nbsp;</option>
                                                <option value="What is the Name of Your Favourite Sports?">What is the Name of Your Favourite Sports?</option>
                                            </select>
                                        </p>
                                    </td>
                                </tr>


                                <tr>
                                    <td>
                                        answer:
                                    </td>

                                    <td>
                                        <p><input type="text" name="answer" id="answer" size="34" placeholder="Enter Password" /></p>
                                    </td>

                                </tr>


                                <tr>
                                    <td>
                                        Select Profile Picture:
                                    </td>

                                    <td>
                                        <p><input type="file" name="path" id="path" required /></p>
                                    </td>
                                </tr>


                                <tr>
                                    <td></td>

                                    <td>
                                        <input type="submit" name="signup" id="signup" value="Register" />
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>

            </form>

        </div>
    </div>
</div>


<script>


    $(document).ready(function () {

        $('#username').blur(function () {

            var username = $('#username').val();
            if (username == "") {
                $('#result').text("Enter Username");
            }
            else {
                $.getJSON("Availability?u=" + username, function (data) {

                    if (data == true) {

                        $('#result').text("User already exists in database");

                        $('#username').val("");
                    }
                    else {

                        $('#result').text("User Name is available");
                    }
                });
            }
        });


    });

    //function checkPassword(evt) {

    //    var pwd = Document.getElementById('pwd');
    //    var cpwd = Document.getElementById('cpwd');
    //    if (pwd != cpwd) {
    //        return false;
    //    }
    //}


    $('#signup').click(function () {

        var pwd = $('#pwd').val();
        var cpwd = $('#cpwd').val();

        if (pwd != cpwd) {
            $('#pwd').focus();
            $('#cpwd').text("");
            return false;
        }

        var username = $('#username').val();
        if (username == "") {
            $('#result').text("Enter Username");
            $('#username').focus();
            return false;
        }

        return true;
    });


    function isNumberKey(evt) {
        var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 31 && (charCode != 43 && charCode != 45 && charCode != 46 && (charCode < 48 || charCode > 57)))
            return false;
        return true;
    }
</script>